.container {
  @apply w-full h-full relative;
  background-image: url('/images/sport_bg.webp');
  background-size: 100% 100%;

  &::before {
    @apply absolute left-0 right-0 top-0 bottom-0 bg-black-60;
    content: '';
  }

  .content {
    @apply absolute w-full h-full flex flex-col justify-center items-center;

    .tips {
      @apply text-white mb-10;
      font-family: 'SimHei', '黑体', sans-serif;
      font-size: 1.875rem;
      line-height: 3.125rem;
    }

    .timeBox {
      @apply flex items-center;

      span {
        @apply inline-block text-center rounded-md;
        width: 3.375rem;
        line-height: 4rem;

        &:nth-child(2n) {
          @apply text-2xl;
          color: rgba(255, 255, 255, 0.8);
          font-family: 'SimHei', '黑体', sans-serif;
        }

        &:nth-child(2n + 1) {
          @apply font-bold text-white bg-theme;
          font-family: OPPOSans;
          font-size: 1.875rem;
        }
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .container {
    .tips {
      font-size: 1.25rem !important;
      margin-bottom: 1.25rem !important;
    }

    .timeBox {
      span {
        width: 1.6875rem !important;
        height: 2rem !important;
        line-height: 2rem !important;
        border-radius: 0.25rem !important;

        &:nth-child(2n) {
          font-size: 0.75rem !important;
        }

        &:nth-child(2n + 1) {
          font-size: 0.9375rem !important;
        }
      }
    }
  }
}
